@import './tools';
@import './ui';

/* 字体文件 */
@font-face {
  font-family: OPPOSANS;
  src: url('~@/mall/scss/font/OPPOSANS-M-subfont.ttf');
}
.font-OPPOSANS {
  font-family: OPPOSANS;
}
page {
  -webkit-overflow-scrolling: touch; // 解决ios滑动不流畅
  height: 100%;
  width: 100%;
  // font-family: OPPOSANS;
  word-break: break-all; //英文文本不换行
  white-space: normal;
  background-color: $bg-page;
  color: $dark-3;
}
::-webkit-scrollbar {
  width: 0;
  height: 0;
  color: transparent;
  display: none;
}
$marginArr: 3, 5, 10, 15, 20, 30;
$fontMap: (
  'm': 12,
  'l': 14,
  'xl': 16,
  'xxl': 18,
  'max': 20
);
body {
  background-color: #f5f5f5;
  font-size: 12px;
  -webkit-font-smoothing: antialiased;
  font-family: arial,sans-serif;
}
view{
  margin: 0;
  padding: 0;
  border: 0;
  font-size: inherit;
  font-weight: normal;
  vertical-align: baseline;
  -webkit-font-smoothing: antialiased; //字体清晰
  box-sizing: border-box;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}

@mixin base-scrollbar {
  &::-webkit-scrollbar {
    width: 5px;
    height: 5px;
  }
  &::-webkit-scrollbar-thumb {
    border-radius: 5px;
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    background: rgba(0, 0, 0, 0.2);
  }
  &::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    border-radius: 0;
    background: rgba(46, 45, 45, 0.1);
  }
}
::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}
::-webkit-scrollbar-thumb {
  border-radius: 5px;
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  background: rgba(0, 0, 0, 0.2);
}
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  border-radius: 0;
  background: rgba(46, 45, 45, 0.1);
}
html,
body {
  font-family: 'Helvetica Neue', Helvetica, Arial, 'PingFang SC', 'Hiragino Sans GB', 'Heiti SC', 'Microsoft YaHei', 'WenQuanYi Micro Hei', sans-serif;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  font-size: 14px;
  -ms-overflow-style: none;
  @include base-scrollbar;
}
b,
strong {
  font-weight: bold;
}
ul,
li {
  list-style: none;
}
a:focus,
a:active {
  outline: none;
}

a,
a:focus,
a:hover {
  cursor: pointer;
  color: inherit;
  text-decoration: none;
}
small {
  font-size: 75%;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
input[type='number'] {
  -moz-appearance: textfield;
}
input,
textarea {
  outline: 0;
}

img {
  max-width: 100%;
  height: auto;
}
// 自动填充的填充色
input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px white inset;
  box-shadow: 0 0 0 1000px white inset;
  -webkit-text-fill-color: #333;
}
.center {
  text-align: center;
}
.auto {
  margin-left: auto;
  margin-right: auto;
}
.fn {
  line-height: normal;
}
.pull-left {
  float: left;
}
.pull-right {
  float: right;
}
.right {
  text-align: right;
}
@each $val in $marginArr {
  .ml#{$val} {
    margin-left: #{$val}px;
  }
  .mr#{$val} {
    margin-right: #{$val}px;
  }
  .mb#{$val} {
    margin-bottom: #{$val}px;
  }
  .mt#{$val} {
    margin-top: #{$val}px;
  }
}
@each $key, $item in $fontMap {
  .#{$key} {
    font-size: #{$item}px !important;
  }
}
.clearfix:after {
  content: '';
  display: block;
  clear: both;
  height: 0;
  visibility: hidden;
}

.flex {
  display: -webkit-flex;
  display: -webkit-box;
  display: flex;
  display: -ms-flexbox;
  .cell-main {
    flex: 1;
  }
  &.middle {
    align-items: center;
  }
  &.wrap {
    flex-wrap: wrap;
  }
  &.start {
    justify-content: flex-start;
  }
  &.end {
    justify-content: flex-end;
  }
  &.center {
    justify-content: center;
  }
  &.between {
    justify-content: space-between;
  }
  &.around {
    justify-content: space-around;
  }
  &.col {
    flex-direction: column;
  }
}
.row2 {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.row1 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.price:before {
  content: '¥';
}

.expand {
  display: none;
  position: fixed;
  top: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
}

.z-in {
  position: relative;
  z-index: 2;
}

.oneline {
  white-space: nowrap;
}

.cursor {
  cursor: pointer;
}

.bold {
  font-weight: bold;
}
.app-root {
  position: relative;
	height: 100%;
}



.table-toolbar {
  margin-bottom: 8px;
  text-align: right;
}

.ant-btn + .ant-btn {
  margin-left: 8px;
}
.tcenter{
  text-align: center;
}
.ant-select {
  min-width: 120px;
}

.img-thumbnail {
  width: 100px;
  height: 50px;
  object-fit: fill;
}

.flex-form {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  margin-left: -16px;
  margin-right: -16px;

  .ant-form-item {
    padding: 0 16px;
  }
}
.col-hui{
  color: #ccc;
}